import { Input, InputRef } from 'antd';
import { useEffect, useRef, useState } from 'react';
import { IBaseProps } from './types';
interface IProps extends IBaseProps<string> {}

export default function StringInput({
  value: initValue,
  disabled,
  onChange: onInputChange,
}: IProps) {
  const [value, setValue] = useState('' + initValue);
  const inputRef = useRef<InputRef>(null);

  useEffect(() => {
    setValue(initValue);
  }, [initValue]);
  const handleInputChange = (value: string) => {
    setValue(value);
  };
  // 失去焦点后，检查输入的是否合法
  const handleBlur = () => {
    // 正则表达式，用于匹配汉字
    const regex = /[\u4e00-\u9fa5]/;
    // 检查输入值是否包含汉字
    if (regex.test(value)) {
      setValue('');
      onInputChange('');
    } else {
      setValue(value);
      onInputChange(value);
    }
  };
  return (
    <Input
      ref={inputRef}
      value={value}
      disabled={disabled}
      onChange={(e) => handleInputChange(e.target.value)}
      onBlur={handleBlur}
    />
  );
}
